<!DOCTYPE html>
<html lang="en">
<!-- 本页面为二级页面，主要内容有一级标题，用来描述页面的大体内容，如景点、没事、酒店。游客点击导航栏的分类可改变标题内容和推荐内容 -->

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>去旅游吧</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"
        integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
    <link rel="stylesheet" href="css/place.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/themes/pill.css">
     <!-- 登录css -->
     <link rel="stylesheet" href="css/login.css">
     <!-- 共用css -->
    <link rel="stylesheet" href="css/share.css">
</head>

<body>
    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="javascrip:;">去旅游吧</a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav navbar-nav-left">
                    <li class="active"><a href="index.html">首页<span class="sr-only">(current)</span></a></li>
                    <li><a href="#" class="nav-link" style="color: whitesmoke; font-size: 16px;">Link</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                            aria-expanded="false">分类<span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">景点</a></li>
                            <li><a href="#">美食</a></li>
                            <li><a href="#">购物</a></li>
                            <li><a href="#">酒店</a></li>     
                        </ul>
                    </li>
                </ul>

                <form class="navbar-form navbar-left">
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="搜你想去的地方...">
                    </div>
                    <button type="submit" class="btn btn-default">Let's go</button>
                </form>

                <ul class="nav navbar-nav navbar-right">
                    <li><button class="nav-login">登录</button></li>
                    <li><button class="nav-signin">注册</button></li>
                </ul>
            </div><!-- /.navbar-collapse -->
        </div><!-- /.container-fluid -->
    </nav>

    <div class="main-box">

        <div class="tit-line">
            <h1>安徽景点</h1>
            <!--可改为安徽美食，酒店，购物，下面的图片推荐也随之改变 -->
        </div>
        <div class="scenic">
            <li>
                <a href="description.html">
                    <img src="images/1.jpg" alt="">
                    <span>安徽黄山</span>
                </a>
            </li>
            <li>
                <a href="description.html">
                    <img src="images/1.jpg" alt="">
                    <span>安徽黄山</span>
                </a>
            </li>
            <li>
                <a href="description.html">
                    <img src="images/1.jpg" alt="">
                    <span>安徽黄山</span>
                </a>
            </li>
            <li>
                <a href="description.html">
                    <img src="images/1.jpg" alt="">
                    <span>安徽黄山</span>
                </a>
            </li>
            <li><a href="#"><img src="images/3.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/4.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/3.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/4.jpg" alt=""></a></li>
            <li><a href="place.html"><img src="images/1.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/2.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/3.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/4.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/3.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/4.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/3.jpg" alt=""></a></li>
            <li><a href="#"><img src="images/4.jpg" alt=""></a></li>
        </div>

    </div>


    <div class="cover"></div> <!-- 遮挡背景 -->

    <div class="login-outside">
        <!--  登录注册外侧div-->

        <div class="form sign-in">
            <h2>欢迎回来</h2>
            <form action="">
                <!--登录表单-->
                <label>
                    <span>邮箱</span>
                    <input type="email" />
                </label>
                <label>
                    <span>密码</span>
                    <input class="pwd" type="password" />
                    <a class="eye" href="javascrip:;"><img src="/images/eye.png" alt=""></a>
                    <a class="eye1" href="javascrip:;"><img src="/images/eye1.png" alt=""></a>

                </label>
                <p class="forgot-pass"><a href="javascript:;">忘记密码？</a></p>
                <button type="button" class="submit">登 录</button>
                <button type="button" class="cancle">取 消</button>
            </form>
        </div>
        <div class="sub-cont">
            <div class="img">
                <div class="img__text m--up">
                    <h2>还未注册？</h2>
                    <p>立即注册，发现大量机会！</p>
                </div>
                <div class="img__text m--in">
                    <h2>已有帐号？</h2>
                    <p>有帐号就登录吧，发现更美丽的地方！</p>
                </div>
                <div class="img__btn">
                    <span class="m--up">注 册</span>
                    <span class="m--in">登 录</span>
                </div>
            </div>
            <div class="form sign-up">
                <h2>立即注册</h2>
                <form action="">
                    <!--注册表单-->
                    <label>
                        <span>用户名</span>
                        <input type="text" />
                    </label>
                    <label>
                        <span>邮箱</span>
                        <input type="email" />
                    </label>
                    <label>
                        <span>密码</span>
                        <input class="pwd" type="password" />
                        <a class="eye" href="javascrip:;"><img src="/images/eye.png" alt=""></a>
                        <a class="eye1" href="javascrip:;"><img src="/images/eye1.png" alt=""></a>

                    </label>
                    <button type="button" class="submit">注 册</button>
                    <button type="button" class="cancle">取 消</button>
                </form>
            </div>

        </div>




    </div> <!-- 登录注册按钮外侧div -->





    <footer>
        <div class="footer-left">
            <div class="footer-left-left">
                <h1>去旅游吧</h1>
                <p>来一场说走就走的旅行！</p>
            </div>
            <div class="footer-left-right">
                <img src="images/erweima.png" alt="">
            </div>

        </div>
        <div class="footer-center">
            <h3>联系我们</h3>
            <p>8888888@qq.com</p>
        </div>
        <div class="footer-right">
            <b>滁州学院计算机与信息工程学院</b>
        </div>
    </footer>






    <script src="js/jquery.min.js"></script>            <!--导航栏隐藏-->

    <script src="js/login.js"></script> <!--  注册页面js -->
    <script src="js/index.js"></script>
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ"
        crossorigin="anonymous"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"
        integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd"
        crossorigin="anonymous"></script>
    <script src="js/scroollup/jquery.min.js"></script>
    <script src="js/scroollup/jquery.scrollUp.min.js"></script>
    
    <script>
        /* 默认 */
        $(function () {
            $.scrollUp();
        });
    </script>

</body>

</html>